<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name=viewport content="with=device-width,initial-scale=1.0">
<link href="resource/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="resource/bootstrap/css/bootstrap-datetimepicker.min.css"
	rel="stylesheet">
<link href="resource/css/basic.css" rel="stylesheet">
<script src="resource/js/jquery.min.js"></script>
<script src="resource/bootstrap/js/bootstrap.min.js"></script>
<script src="resource/bootstrap/js/bootstrap-datetimepicker.min.js"></script>
<script
	src="resource/bootstrap/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="resource/js/user.js"></script>
<script src="resource/ueditor/ueditor.config.js"></script>
<script src="resource/ueditor/ueditor.all.js"></script>
<script>
	$(function() {
		$('#btnLogout').click(logout);
		$('#department>option').click(getMajorListByDepartment);
		$('#userInfoCommit').click(updateUserInfo);
		$('#imgCommit').click(updateLogo);
		var $logoEditor = new UE.ui.Editor({
			toolbars : [ [ 'insertimage' ] ],
			autoHeightEnabled : false
		});
		$logoEditor.render('logoEditor');
		$logoEditor.ready(function() {
			$logoEditor.hide();//隐藏编辑器
		});
		//监听图片上传
		$logoEditor.on('beforeInsertImage', function(t, arg) {
			$('#userLogo>img').attr('src', arg[0].src);
		});
		$('#imgUpload').click(function() {
			var myImage = $logoEditor.getDialog('insertimage');
			myImage.open();
		});

		$('.form_date').datetimepicker({
			language : 'zh-CN',
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 2,
			minView : 2,
			forceParse : 0
		});
	});
</script>
<title>个人信息</title>
</head>
<body>
	<nav class="navbar navbar-primary navbar-fixed-top" role="navigation">
		<div class="container-fluid">
			<div class="navbar-header">
				<a href="index"><img class="img-responsive"
					src="resource/image/header3.png" /></a>
			</div>
			<ul class="user nav navbar-nav navbar-right">
				<c:choose>
					<c:when test="${user != null }">
						<li><a href="#"><i class="glyphicon glyphicon-comment"></i>
								我 的 消 息</a></li>
						<li><a href="#"
							class="dropdown-toggle gropdown-block gropdown-primary"
							data-toggle="dropdown"> <img style="height: 18px"
								src="${user.logo }" /> ${user.petName} <span class="caret"></span>
						</a>
							<div class="dropdown-menu" role="menu">
								<div class="row">
									<div class="col-xs-6">
										<dl class="col-xs-offset-2">
											<dd>
												<img class="img-circle img-responsive" src="${user.logo }" />
											</dd>
											<dt class="text-center">
												<a class="list-default" target="view_window"
													href="userCenter"> ${user.petName }</a>
											</dt>
										</dl>
									</div>

									<div class="col-xs-6">
										<ul class="list-unstyled">
											<li class="list-block"><a target="view_window"
												href="userCenter"><i class="glyphicon glyphicon-home"></i>
													个 人 中 心</a></li>
											<li class="list-block"><a href="#"><i
													class="glyphicon glyphicon-comment"></i> 我 的 消 息</a></li>
											<li class="list-block"><a target="view_window"
												href="userInfo"><i class="glyphicon glyphicon-user"></i>
													信 息 编 辑 </a></li>
											<li class="list-block"><a target="view_window"
												href="userLesson"><i class="glyphicon glyphicon-book"></i>
													课 程 管 理</a></li>
											<li class="list-block"><a target="view_window"
												href="userExamResults"><i
													class="glyphicon glyphicon-pencil"></i> 成 绩 查 询</a></li>
											<li class="list-block"><a id="btnLogout" href="#"><i
													class="glyphicon glyphicon-off"></i> 退 出 登 录</a></li>
										</ul>
									</div>
								</div>
								<div role="row"></div>
							</div></li>
					</c:when>
					<c:otherwise>
						<li><a href="login"><i class="glyphicon glyphicon-user"></i>
								登 陆</a></li>
						<li><a href="regist"><i class="glyphicon glyphicon-cog"></i>
								注 册</a></li>
					</c:otherwise>
				</c:choose>
			</ul>
		</div>
	</nav>
	<div class="container">
		<ul class="nav nav-tabs">
			<li role="navigation" class="active"><a href="#">个人信息</a></li>
			<li role="navigation"><a href="userLesson">订阅课程</a></li>
			<li role="navigation"><a href="userExamResults">成绩查询</a></li>
		</ul>
		<div class="panel panel-default">
			<div class="panel-body">
				<div class="col-sm-2">
					<div class="list-group">
						<a class="list-group-item" data-toggle="tab" href="#userInfo">基本资料</a>
						<a class="list-group-item" data-toggle="tab"
							href="#updateUserInfo">修改资料</a>
					</div>
					<div class="list-group">
						<a class="list-group-item" data-toggle="tab" href="#userLogo">头像变更</a>
					</div>
				</div>
				<div class="col-sm-10 panel panel-default">
					<div class="panel-body tab-content">
						<div id="userInfo" class="tab-pane fade active in">
							<dl class="dl-horizontal">
								<dt>昵称：</dt>
								<dd>${user.petName}</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>性别：</dt>
								<dd>${userInfo.sex }</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>真实姓名：</dt>
								<dd>${userInfo.name }</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>出生日期：</dt>
								<dd>${fn:substring(userInfo.birthday,0,10)}</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>专业：</dt>
								<dd>${userInfo.major.majorName }</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>邮箱：</dt>
								<dd>${userInfo.email }</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>联系方式：</dt>
								<dd>${userInfo.phoneNum }</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
							</dl>
							<a class="btn btn-success" data-toggle="tab"
								href="#updateUserInfo">编辑</a>
						</div>
						<div id="userLogo" class="tab-pane fade">
							<img alt="头像" class="img-responsive" src="${user.logo}" />
							<div>
								<br />
								<button id="imgUpload" class="btn btn-success" type="button">选择图片...</button>
								<button id="imgCommit" class="btn btn-danger" type="button">
									保 存</button>
								<textarea id="logoEditor" rows="0" cols="0"></textarea>
							</div>
							<br />
						</div>
						<div id="updateUserInfo" class="tab-pane fade">
							<dl class="dl-horizontal">
								<dt>昵称：</dt>
								<dd>
									<input class="form-control" name="petName" type="text"
										value="${user.petName}" />
								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>性别：</dt>
								<dd>
									<c:choose>
										<c:when test="${userInfo.sex eq '男' }">
											<label><input checked="checked" type="radio"
												name="sex" value="男"> 男 </label>
											<label><input type="radio" name="sex" value="女">
												女 </label>
										</c:when>
										<c:otherwise>
											<label><input type="radio" name="sex" value="男">
												男 </label>
											<label><input checked="checked" type="radio"
												name="sex" value="女"> 女 </label>
										</c:otherwise>
									</c:choose>
								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>真实姓名：</dt>
								<dd>
									<input class="form-control" name="name" type="text"
										value="${userInfo.name }" />
								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>出生日期：</dt>
								<dd>
									<div class="input-group date form_date col-md-5" data-date=""
										data-date-format="dd MM yyyy" data-link-field="dtp_input2"
										data-link-format="yyyy-mm-dd">
										<input id="dtp_input2" class="form-control" name="birthday"
											type="text" value="${fn:substring(userInfo.birthday,0,10)}"
											readonly /> <span class="input-group-addon"><span
											class="glyphicon glyphicon-calendar"></span></span>
									</div>
								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>专业：</dt>
								<dd>
									<div class="col-xs-6">
										<select id="department" class="form-control" name="department">
											<c:forEach items="${department }" var="dm">
												<c:choose>
													<c:when test="${dm.id == userInfo.major.stuDepartment.id }">
														<option selected="selected" value="${dm.id}">${dm.name }</option>
													</c:when>
													<c:otherwise>
														<option value="${dm.id}">${dm.name }</option>
													</c:otherwise>
												</c:choose>
											</c:forEach>
										</select>
									</div>
									<div class="col-xs-6">
										<select id="major" class="form-control" name="major">
											<c:forEach items="${major }" var="mj">
												<c:choose>
													<c:when test="${mj.id == userInfo.major.id }">
														<option selected="selected" value="${mj.id}">${mj.majorName }</option>
													</c:when>
													<c:otherwise>
														<option value="${mj.id}">${mj.majorName }</option>
													</c:otherwise>
												</c:choose>
											</c:forEach>
										</select>
									</div>

								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>邮箱：</dt>
								<dd>
									<input class="form-control" name="email" type="text"
										value="${userInfo.email }" />
								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
								<dt>联系方式：</dt>
								<dd>
									<input class="form-control" name="phoneNum" type="text"
										value="${userInfo.phoneNum }" />
								</dd>
								<dt>
									<br />
								</dt>
								<dd>
									<br />
								</dd>
							</dl>
							<button id="userInfoCommit" class="btn btn-danger">保存</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<footer class="navbar navbar-inverse navbar-static-bottom">
		<div class="container-fluid">
			<br />
			<div class="row">
				<div class="col-sm-3 col-sm-offset-1">
					<h4>四川交通职业技术学院在线教育</h4>
					<p>四川交通职业技术学院在线教育，让你更好的学习新知识，更便捷的学习方式</p>
				</div>
				<div class="col-sm-4 col-sm-offset-1">
					<h4>关于我们</h4>
					<span class="col-xs-4"><a href="aboutUs">关于我们</a></span> <span
						class="col-xs-8"><a href="#">学校云</a></span> <span class="col-xs-4"><a
						href="#">联系我们</a></span> <span class="col-xs-8"><a href="#">常见问题</a></span>
					<span class="col-xs-4"><a href="#">意见反馈</a></span> <span
						class="col-xs-8"><a href="#">法律条款</a></span>
				</div>
				<div class="col-sm-3">
					<h4>关注我们</h4>
				</div>
			</div>
			<br />
			<p class="text-center">Copyright © 2015 SVTCC. All Rights
				Reserved.</p>
			<p class="text-center">四川交通职业技术学院 版权所有 | 四川交通职业技术学院在线课堂服务协议</p>
		</div>
	</footer>
</body>
</html>